<script setup>
import {PackER,Main} from "@ui/pack-ER"
import { h } from "vue";
const main = new Main();

main.toolbar.reset({edge:false,switch:false,menu:false})
// 不显示顶栏菜单
main.menu.enabled.value = false;

const icons = [
    h('div', { class: "i-emojione:dotted-six-pointed-star w-1em h-1em" }),
    h('div', { class: "i-noto-v1:dotted-six-pointed-star w-1em h-1em" }),
]

const meta = {
    shape: 'rect',
    width: 100,
    height: 40,
    x: 100,
    y: 100,
    label: 'edge',
}
const nodelist = [
    {
        label: 'A',
        icon: icons[0],
        fixed:true,
        children: [
            { icon: icons[0], label: "A-1", meta }, { icon: icons[0], label: "A-2", meta },
            {
                label: 'B',
                icon: icons[1],
                children: [
                    { icon: icons[1], label: "B-1", meta }, { icon: icons[1], label: "B-2", meta }
                ]
            }
        ]
    },
    {
        label: 'B',
        icon: icons[1],
        fixed: true,
        children: [
            { icon: icons[1], label: "B-1", meta }, { icon: icons[1], label: "B-2", meta },
            {
                label: 'A',
                icon: icons[0],
                // fixed:true,
                children: [
                    { icon: icons[0], label: "A-1", meta }, { icon: icons[0], label: "A-2", meta },
                    {
                        label: 'B',
                        icon: icons[1],
                        children: [
                            { icon: icons[1], label: "B-1", meta }, { icon: icons[1], label: "B-2", meta }
                        ]
                    }
                ]
            },
        ]
    },
]

main.nodelist.setList(nodelist);

main.graph.onMounted((graph) => {
    graph.addNode({
        shape: 'er-node',
        "label": "产品维",
        topLabel:"ttttt",
        // "width": 150,
        stroke:"#165DFFFF",
        "position": {
            "x": 324,
            "y": 150
        },
        "ports": [
            {
                "id": "in.0.1.1",
                "group": "list",
                
                "attrs": {
                    label:{text:"aaaaaaaaaa"},
                    "portNameLabel": {
                        "text": "产品键"
                    },
                    "portTypeLabel": {
                        "text": "STRING"
                    }
                }
            },
            {
                "id": "in.0.1.2",
                "group": "list",
                "attrs": {
                    "portNameLabel": {
                        "text": "产品名称"
                    },
                    "portTypeLabel": {
                        "text": "STRING"
                    }
                }
            },
            {
                "id": "in.0.1.3",
                "group": "list",
                "attrs": {
                    "portNameLabel": {
                        "text": "产品描述"
                    },
                    "portTypeLabel": {
                        "text": "NUMBER"
                    }
                }
            },
            {
                "id": "in.0.1.4",
                "group": "list",
                "attrs": {
                    "portNameLabel": {
                        "text": "产品售价"
                    },
                    "portTypeLabel": {
                        "text": "BOOLEAN"
                    }
                }
            },
            {
                "id": "in.0.1.5",
                "group": "list",
                "attrs": {
                    "portNameLabel": {
                        "text": "产品质量"
                    },
                    "portTypeLabel": {
                        "text": "BOOLEAN"
                    }
                }
            },
        ]
    })
    graph.addNode({
        shape: 'er-node',
        "label": "时间维",
        // "width": 150,
        "position": {
            "x": 54,
            "y": 150
        },
        "ports": [
            {
                "id": "out.0.1.1",
                "group": "list",
                "attrs": {
                    "portNameLabel": {
                        "text": "时间键22222222222222222222222222222222222222222222222222222222222222222222222222222222222"
                    },
                    "portTypeLabel": {
                        "text": "STRING"
                    }
                }
            },
            {
                "id": "out.0.1.2",
                "group": "list",
                "attrs": {
                    "portNameLabel": {
                        "text": "年"
                    },
                    "portTypeLabel": {
                        "text": "STRING"
                    }
                }
            },
            {
                "id": "out.0.1.3",
                "group": "list",
                "attrs": {
                    "portNameLabel": {
                        "text": "月"
                    },
                    "portTypeLabel": {
                        "text": "STRING"
                    }
                }
            },
            {
                "id": "out.0.1.4",
                "group": "list",
                "attrs": {
                    "portNameLabel": {
                        "text": "日"
                    },
                    "portTypeLabel": {
                        "text": "STRING"
                    }
                }
            },
        ]
    })

    // graph.addNode({
    //     shape: 'er-node',
    //     "label": "地域维",
    //     // "width": 150,
    //     "position": {
    //         "x": 324,
    //         "y": 150
    //     },
    //     "ports": [
    //         {
    //             "id": "1-1",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "地域键"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-2",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "国家"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-3",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "省"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-4",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "市"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //     ]
    // })

    // graph.addNode({
    //     shape: 'er-node',
    //     "label": "部门维",
    //     // "width": 150,
    //     "position": {
    //         "x": 224,
    //         "y": 150
    //     },
    //     "ports": [
    //         {
    //             "id": "1-1",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "部门键"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-2",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "集团"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-3",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "事业部"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-4",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "分公司"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-5",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "分厂"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-6",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "产线"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //     ]
    // })

    // graph.addNode({
    //     shape: 'er-node',
    //     "label": "设备",
    //     // "width": 150,
    //     "position": {
    //         "x": 224,
    //         "y": 150
    //     },
    //     "ports": [
    //     {
    //             "id": "2-1",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "部门键"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "2-2",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "时间键"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "2-3",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "产品键"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "2-4",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "地域键"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-1",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "设备编码"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-2",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "设备名称"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-3",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "设备状态"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-4",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "设备描述"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-5",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "设备品牌"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-6",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "设备分类"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-7",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "开机时长"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-8",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "运行时长"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-9",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "故障时长"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //         {
    //             "id": "1-10",
    //             "group": "list",
    //             "attrs": {
    //                 "portNameLabel": {
    //                     "text": "停机时长"
    //                 },
    //                 "portTypeLabel": {
    //                     "text": "STRING"
    //                 }
    //             }
    //         },
    //     ]
    // })

})
</script>

<template>
    <div class="w-full h-500px">
        <PackER :main="main"></PackER>
    </div>
</template>